<template>
<div class="Upload">
    <el-upload class="upload-demo" action="#" :limit="1" :on-change="change" :before-upload="beforeUpload">
        <el-button size="small" type="primary">点击上传用户</el-button>
        <div slot="tip" class="el-upload__tip">
            只能上传xls/xlsx文件，且不超过500kb
            <el-link href="/用户导入模板.xlsx" type="success" target="_blank">下载用户导入模板</el-link>
        </div>
    </el-upload>
    <div v-if="errCount.length">
        <el-alert style="" v-for="(item,index) in errCount" :key="index" :title="item.errMsg" type="error" :show-icon="true" :closable="false">
        </el-alert>
    </div>
</div>
</template>

<script>
export default {
    name: "Upload",
    data() {
        return {
            fileList: [],
            dialogImageUrl: "",
            disabled: false,
            text: "",
            errCount: []
        };
    },

    methods: {
        change(file) {
            let img = this.$common.uploadFiles(file.raw);
            img
                .then((res) => {
                    if (res.errorCode === "00000") {
                        this.fileList = res.data
                        if (this.fileList.errCount > 0) {
                            this.errCount = this.fileList.errorMsg
                        }

                        this.$message({
                            message: '导入成功' + this.fileList.successCount + '条',
                            type: "success",
                            duration: 5000
                        });

                    } else {
                        this.$message({
                            message: res.errorMsg,
                            type: "warning",
                        });
                    }
                })
                .catch((err) => {
                    // this.$message({
                    //     message: err,
                    //     type: "error",
                    // });
                });
        },
        beforeUpload() {

        },
        handleRemove(file, fileList) {
            console.log(file, fileList);
        },
        handlePreview(file) {
            console.log(file);
        },
        handleExceed(files, fileList) {
            this.$message.warning(
                `当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
          files.length + fileList.length
        } 个文件`
            );
        },
        beforeRemove(file, fileList) {
            return this.$confirm(`确定移除 ${file.name}？`);
        },
    },
};
</script>
